<template>
  <el-dialog title="会议任务审批" :visible.sync="visible"  width="74%" :center="true"
             :close-on-click-modal="false"
             @close="closeDialog">
    <el-table :data="meetingTasks" border size="mini">
      <el-table-column type="index" label="序号" width="70px"></el-table-column>
      <el-table-column label="任务名称">
        <template slot-scope="scope">
          <el-input v-model="scope.row.title"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="起止时间" width="220px">
        <template slot-scope="scope">
          <el-date-picker style="width: 100% ;" size="mini"
                          v-model="scope.row.time"
                          type="daterange"
                          range-separator="至"
                          start-placeholder="开始日期"
                          end-placeholder="结束日期" @change="updateMeetingTask(scope.row)">
          </el-date-picker>
        </template>
      </el-table-column>
      <el-table-column label="任务分类" width="100px">
        <template slot-scope="scope">
          <el-select v-model="scope.row.categoryId" placeholder="请选择" style="width: 100%">
            <el-option
                v-for="item in optionsTask"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column label="项目号" width="100px">
        <template slot-scope="scope">
          <el-input v-model="scope.row.projectSn"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="负责人" width="100px">
        <template slot-scope="scope">
          <el-input v-model="scope.row.reportBy"></el-input>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="releaseMeetingTask" size="mini">发 布</el-button>
      <el-button type="primary" @click="cancle" size="mini">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import moment from "moment";

export default {
  name: "ReleaseMeetingTasks",
  computed: {
    visible: {
      get() {
        return this.$store.state.isVisible;
      },
      set(value) {
        this.$store.commit('setIsVisible', value);
      }
    },
  },
  watch: {
    visible(newVal) {
      console.log('Visible changed to: ', newVal);
    }
  },
  data(){
    return{
      meetingTasks:[{}],
    }
  },
  methods:{
    updateMeetingTask(row) {
      let startTime = '';
      let endTime = '';
      let reportCount = 0;
      if (row.time && row.time.length === 2 && row.frequency) {
        // 转换时间为字符串格式
        startTime = moment(row.time[0]).format('YYYY/MM/DD HH:mm:ss');
        endTime = moment(row.time[1]).format('YYYY/MM/DD HH:mm:ss');
        const startDate = new Date(row.time[0]);
        const endDate = new Date(row.time[1]);
        const diffTime = Math.abs(endDate - startDate);
        const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
        const adjustedDiffDays = diffDays === 0 ? 1 : diffDays;

        switch (row.frequency) {
          case '天':
            reportCount = adjustedDiffDays;
            break;
          case '周':
            reportCount = Math.ceil(adjustedDiffDays / 7);
            break;
          case '月':
            const months = (endDate.getFullYear() - startDate.getFullYear()) * 12 +
                (endDate.getMonth() - startDate.getMonth());
            reportCount = Math.ceil(months);
            break;
          default:
            reportCount = 0;
        }
      }
      // 更新 row 对象
      row.startTime = startTime;
      row.endTime = endTime;
      row.reportCount = reportCount;
    },
    releaseMeetingTask() {
      const meetingTasks = this.meetingTasks.map(row => ({
        title: row.title,
        categoryId: row.categoryId,
        projectSn: row.projectSn,
        reportBy: row.reportBy,
        startTime: row.startTime,
        endTime: row.endTime,
        reportCount: row.reportCount,
        host:this.meetingVO.host,
        frequency:row.frequency
      }));
      this.$http.post("/task/record/apply/", meetingTasks).then((response) => {
        console.log(meetingTasks)
        if (response.data.code == 1) {
          this.$message({type: "success", message: `申请成功:下一步审批人${this.meetingVO.host}`, showClose: true})
          console.log(`申请转换的任务数据:${JSON.stringify(this.meetingTasks, null, 2)}`)
        } else {
          this.$message({type: "error", message: "申请失败:", showClose: true})
        }
      })
    },
    cancle(){
      this.visible = false
    },
    closeDialog(){
      this.visible = false
    },
  },
  mounted(){
    this.$http.get(`/meeting/record/${this.meetingId}`).then((response) => {
      if (response.data.code == 1) {
        this.meetingRecord = response.data.data
        console.log(`会议记录数据:${JSON.stringify(this.meetingRecord, null, 2)}`)
      } else {
        this.$message({type: "error", message: "获取会议记录数据不成功:", showClose: true})
      }
    })
  }
}
</script>

<style scoped>

</style>